<!--
*@Author: zt
*@Description:当日备勤人数
*@Date: 2024-08-21
-->
<template>
  <u-dialog v-bind="$attrs" :title="$attrs.title" :hideBtns="['submit']">
    <u-busi-card title="人员列表">
      <a-list
        :grid="{ gutter: [16, 16], column: 4 }"
        style="margin: 0 0 12px 8px"
        :data-source="$attrs.data"
      >
        <template #renderItem="{ item }">
          <a-row align="middle">
            <div class="u-name-box">{{ item.theme }}</div>
            <a-space direction="vertical" align="middle" class="f-margin-l10">
              <span class="u-span-name f-font-family">
                {{ item.theme }}
              </span>
            </a-space>
          </a-row>
        </template>
      </a-list>
    </u-busi-card>
  </u-dialog>
</template>

<script lang="ts" setup></script>

<style lang="scss" scoped>
.u-name-box {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  text-align: center;
  line-height: 80px;
  background: linear-gradient(348deg, #1890ff 0%, #dbedfe 100%);
  font-size: var(--font-size-level-1);
  color: #fff;
}

.u-span-name {
  font-weight: 400;
  font-size: var(--font-size-level-2);
  color: #1890ff;
}
</style>
